import 'dart:math';

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:yqmssa_app/config/app_config.dart';
import 'package:yqmssa_app/router/page_router.dart';
import 'package:yqmssa_app/utils/debounce_utils.dart';
import 'package:yqmssa_app/views/login/login_manager.dart';
import 'package:get/get.dart';

class LoginView extends StatelessWidget {
  const LoginView({super.key});

  @override
  Widget build(BuildContext context) {
    final manager = Get.put(LoginManager());
    return Scaffold(
      backgroundColor: Colors.white,
      resizeToAvoidBottomInset: false,
      extendBody: true,
      body: Stack(
        children: [
          Image.asset(AppConfig.imagePath("bg_img.png")),
          SafeArea(
            top: true,
            child: Padding(
              padding: const EdgeInsets.symmetric(horizontal: 24),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.start,
                children: [
                  const SizedBox(height: 64),
                  Row(
                    children: [
                      ClipRRect(
                        borderRadius: BorderRadius.circular(66),
                        child: Image.asset(
                          AppConfig.appLogo,
                          width: 64,
                          height: 64,
                        ),
                      ),
                      const SizedBox(width: 8),
                      Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            (AppConfig.appInitData.channelText?.loginTitle ?? "").isEmpty
                                ? AppConfig.appName
                                : (AppConfig.appInitData.channelText?.loginTitle ?? ""),
                            style: const TextStyle(fontSize: 20, fontWeight: FontWeight.w700, color: Color(0XFF333333)),
                          ),
                          const SizedBox(height: 4),
                          Text(
                            (AppConfig.appInitData.channelText?.loginSubtitle ?? "").isEmpty
                                ? "信用卡/网贷逾期处理"
                                : AppConfig.appInitData.channelText?.loginSubtitle ?? "",
                            style: const TextStyle(fontWeight: FontWeight.w500, color: Color(0XFF666666)),
                          ),
                        ],
                      ),
                    ],
                  ),
                  const SizedBox(height: 40),
                  const Text("手机号码", style: TextStyle(fontWeight: FontWeight.w500)),
                  const SizedBox(height: 8),
                  TextField(
                    controller: manager.phone,
                    focusNode: manager.phoneFocus,
                    maxLength: 11,
                    maxLines: 1,
                    keyboardType: TextInputType.phone,
                    inputFormatters: [
                      FilteringTextInputFormatter.digitsOnly,
                    ],
                    decoration: InputDecoration(
                      hintText: "请输入手机号",
                      border: InputBorder.none,
                      hintStyle: const TextStyle(color: Color(0XFF666666), fontSize: 16),
                      prefixIcon: Padding(
                        padding: const EdgeInsets.only(left: 10, right: 8),
                        child: Row(
                          mainAxisSize: MainAxisSize.min,
                          children: [
                            const Text("+86", style: TextStyle(fontSize: 16, color: Color(0XFF333333))),
                            Container(
                              width: 1,
                              height: 18,
                              margin: const EdgeInsets.only(left: 8),
                              decoration: BoxDecoration(color: const Color(0XFFEFEFEF), borderRadius: BorderRadius.circular(10)),
                            ),
                          ],
                        ),
                      ),
                      enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(4),
                        borderSide: const BorderSide(width: 1, color: Color(0XFFEFEFEF)),
                      ),
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(4),
                        borderSide: const BorderSide(width: 1, color: Color(0XFFE4B591)),
                      ),
                      counterText: "",
                    ),
                  ),
                  const SizedBox(height: 16),
                  const Text("验证码", style: TextStyle(fontWeight: FontWeight.w500)),
                  const SizedBox(height: 8),
                  TextField(
                    controller: manager.code,
                    focusNode: manager.codeFocus,
                    maxLines: 1,
                    maxLength: 6,
                    inputFormatters: [
                      FilteringTextInputFormatter.digitsOnly,
                    ],
                    keyboardType: TextInputType.number,
                    decoration: InputDecoration(
                      hintText: "请输入验证码",
                      border: InputBorder.none,
                      hintStyle: const TextStyle(color: Color(0XFF666666), fontSize: 16),
                      enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(4),
                        borderSide: const BorderSide(width: 1, color: Color(0XFFEFEFEF)),
                      ),
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(4),
                        borderSide: const BorderSide(width: 1, color: Color(0XFFE4B591)),
                      ),
                      counterText: "",
                      suffixIcon: Row(
                        mainAxisSize: MainAxisSize.min,
                        children: [
                          Container(
                            width: 1,
                            height: 18,
                            decoration: BoxDecoration(color: const Color(0XFFEFEFEF), borderRadius: BorderRadius.circular(10)),
                          ),
                          TextButton(
                            onPressed: () {
                              if (!manager.codeText.contains("秒")) {
                                manager.codeFocus.requestFocus();
                                DebounceUtils.debounce(func: manager.sendCode);
                              }
                            },
                            child: Obx(() {
                              return Text(
                                manager.codeText.value,
                                style: TextStyle(
                                    fontSize: 16,
                                    fontWeight: FontWeight.w500,
                                    color: manager.codeText.contains("秒") ? Colors.grey.shade500 : const Color(0XFF4A1C02)),
                              );
                            }),
                          ),
                        ],
                      ),
                    ),
                  ),
                  const SizedBox(height: 40),
                  GestureDetector(
                    onTap: () {
                      FocusScope.of(context).unfocus();
                      DebounceUtils.debounce(func: manager.appLogin);
                    },
                    child: Container(
                      height: 44,
                      decoration: BoxDecoration(
                          gradient: const LinearGradient(
                            colors: [Color(0XFFF4DDC2), Color(0XFFE4B591)],
                          ),
                          borderRadius: BorderRadius.circular(4)),
                      alignment: Alignment.center,
                      child: const Text("登录", style: TextStyle(fontSize: 18, fontWeight: FontWeight.w600, color: Color(0XFF4A1C02))),
                    ),
                  ),
                  const SizedBox(height: 24),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.center,
                    children: [
                      Transform.scale(
                        scale: 0.8,
                        child: Obx(() {
                          return Checkbox(
                              value: manager.isRead.value,
                              shape: const CircleBorder(),
                              side: const BorderSide(width: 1, color: Color(0XFF999999)),
                              activeColor: const Color(0XFFE4B591),
                              materialTapTargetSize: MaterialTapTargetSize.shrinkWrap,
                              splashRadius: 10,
                              visualDensity: const VisualDensity(horizontal: -3, vertical: -4),
                              onChanged: (val) {
                                manager.isRead.value = val ?? false;
                              });
                        }),
                      ),
                      const Text("我已阅读并同意", style: TextStyle(color: Color(0XFF999999), fontWeight: FontWeight.w500)),
                      InkWell(
                        onTap: () {
                          Get.toNamed(PageRouter.agreement, parameters: {"title": "用户协议", "url": AppConfig.xieYIData.userAgreementUrl});
                        },
                        child: const Text("《用户协议》", style: TextStyle(color: Colors.black)),
                      ),
                      InkWell(
                        onTap: () {
                          Get.toNamed(PageRouter.agreement, parameters: {"title": "隐私政策", "url": AppConfig.xieYIData.privacyAgreementUrl});
                        },
                        child: const Text("《隐私政策》", style: TextStyle(color: Colors.black)),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ),
          Positioned(
            bottom: 0,
            right: 0,
            left: 78,
            child: Transform.rotate(
              angle: pi,
              child: Image.asset(AppConfig.imagePath("bg_img.png")),
            ),
          ),
        ],
      ),
    );
  }
}
